<template>
  <div style="width:100%;height: 100%;background:#fff">
    <div class="big_div">
     <!-- <x-header header-background-color="#fff" style="position: fixed;width: 100%;z-index: 999;">信息反馈列表</x-header> -->
      <x-header header-background-color="#fff" :left-options="{showBack: true,preventGoBack:true}"  @on-click-back="GoBack" >信息反馈列表 </x-header>
      <div class="big_content" style="padding-top:0px">
        <ul class="myui" ref="container">
          <mu-load-more @refresh="refresh" :refreshing="refreshing" :loading="loading" @load="load">
            <li @click="openInfo(item)" v-for="(item,index) in arr" :key="index">
                <div class="rai">
                    <i></i>
                </div>
                <div class="imga">
                    <span>{{item.feedbacktime}}</span>
                        <img v-if="item.attachids !== ''" src="../../assets/images/xa_03.png" alt="">
                </div>
                <p><span>反馈人:</span>{{item.createorgcodeStr}}{{item.feedBackperson}}</p>
                <div class="fs">{{item.feedbackcon}}</div>
            </li>
            <div v-if="arr&&arr.length==0&&showNoData" style="width:100%;text-align:center;padding-top: 10%;">
              <img src="../../assets/images/notdata.png" />
            </div>
          </mu-load-more>
</ul>
      </div>
    </div>

    <popup v-if="eventModel" v-model="eventModel" height="100%" width="100%" position="right">
        <feedbackDetails  :itemObj="itemObj" :param='id' @close="closeInfo"/>
    </popup>
  </div>
</template>



<script>
import { Datetime, PopupPicker, Group, Cell, Picker, XButton, Divider, XSwitch,XHeader,Popup } from 'vux'
import { xcListData} from '@/assets/js/service'
import feedbackDetails from "./feedbackDetails";
export default {
  components: {
    PopupPicker,
    Group,
    Picker,
    XButton,
    Divider,
    Cell,
    XSwitch,
    Datetime,
    XHeader,
    Popup,
    feedbackDetails
  },
  props:['refid'],
  data () {
    return {
      queryMap:{},
      date: '',
      eventlist:[],
      refreshing: false,
      loading: false,
      currindex:1,
      text: 'List',
      arr:[],
      eventModel :false,
      itemObj:{},
      id:"",
      showNoData:false,
    }
  },
  created(){ 
    let _this=this;
    _this.init()
    this.$enJsBack()//调用安卓方法（手机back键返回问题）
  },
  mounted(){
    window.GoBack=this.GoBack;//安卓调用GoBack（手机back键返回问题）
  },
  methods: {
    openInfo(_item){
      let _this=this;
      _this.itemObj =  _item
      console.log(_item)
      _this.eventModel=true;
      //this.$showBottomToast(_type); 
    }, 
    // page(t){
    //     this.$router.push({ path:'/feedbackDetails',query:{id: t}})
    // }, 
    closeInfo(){
      this.eventModel=false;
      window.GoBack=this.GoBack;//安卓调用GoBack（手机back键返回问题）
    },
    changeHandle(){
       this.$showBottomToast("changeHandle");
    },
    GoBack(){
      this.$closeStates();
      this.$emit("close")
    },
    refresh () {
      this.currindex=1;
      this.refreshing = true;
      this.showNoData=false;
      this.$refs.container.scrollTop = 0;
      this.eventlist=[];
      this.init();
    },
    load () {
      this.loading = true;
      this.currindex++;
      this.init()
    },
    init(){
        let _this=this;
        let param = {
            eventId:_this.refid,
            orgcode:"",
            pageNo:_this.currindex,
            pageSize:10
        }
        xcListData(param, res => {
          _this.showNoData=true;
          _this.refreshing = false;
          _this.loading = false;
          console.log(res,999);
          if (res.success) {    
              if(_this.currindex>1){
                if(res.data&&res.data.length>0){
                  res.data.forEach((item,index)=>{
                     _this.arr.push(item);
                  })
                }
              }else{
                _this.arr =res.data;
              }
              //_this.$showBottomToast("获取成功");
          } else {
            _this.$showBottomToast(res.msg);
          }
        });

        //   xcListData(param,function(res){
        //       console.log(res)
        //   })
    }
  }
}
</script>

<style scoped>
.big_div{
  width: 100%;
  height: 100%;
  
}
.big_content{
    width: 100%;
    height: calc( 100% - 45px )  ;
  }
.myui{
  width: 100%;
  height: 100%;
  overflow: auto;
}
.myui li{
    margin-left: 25px;
    padding-left: 15px;
    border-left: 1px solid #e9eaf0;
    position: relative;
    padding-top: 25px
}
.myui li .rai{
        border: 1px solid rgb(0, 129, 255);
        background: #fff;
        width: 15px;
        height: 15px;
        border-radius: 50%;
        position: absolute;
        left: -8px;
}
.myui li .rai i{
        border: 1px solid rgb(0, 129, 255);
        background: #fff;
        width: 9px;
        height: 9px;
        border-radius: 50%;
        background: rgb(0, 129, 255);
        display: block;
        position: absolute;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        margin: auto
}
.myui li .imga{
margin-top: -3px;
padding-left: 3px;
}
.myui li .imga img{
    width: 14px;
}
.myui li p{color: #2086fe;font-size: 16px;margin: 8px 0;padding-left: 3px;}
.myui li p span{color: #000;font-size: 16px}
.myui li .fs{color: #000;font-size: 14px;color: #727172;padding-left: 3px;display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
overflow: hidden;
word-wrap: break-word;
word-break: break-all;
}
</style>